<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style>
			div {
				width: 50px;
				height: 50px;
			}

			/*CSS3 的文本阴影*/
			.p1 {
				text-shadow: 5px 5px 5px red;
			}

			/*CSS3 box-shadow属性*/
			.p2 {
				box-shadow: 5px 5px 5px #888888;
			}
			/*CSS3 Text Overflow属性*/
			.p3{
				text-overflow: ellipsis;
				white-space: nowrap;
				overflow: hidden;
			}
			/*CSS3的换行*/
			.p4{
				word-wrap: break-word;
				border: 1px solid black;
			}
			/*CSS3 单词拆分换行*/
			.p5{
				word-break: keep-all;
				width: 100px !important;
			}
		</style>
	</head>
	<body>
		<!--CSS3 的文本阴影-->
		<h1 class="p1">我是一个H1标签</h1>
		<!--CSS3 box-shadow属性-->
		<div class="p2"></div>
		<!--CSS3 Text Overflow属性-->
		<div class="p3">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</div>
		<!--CSS3的换行-->
		<div class="p4">aaaaaa</div>
		<!--CSS3 单词拆分换行-->
		<div class="p5">This ab</div>
	</body>
</html>